// Grid settings
$grid-guides-color:         #8aa8c0;
$grid-guides-opacity:       .2;

$grid-type:                 pixel;
$grid-size:                 1020px;
$grid-total-columns:        8;
$grid-desired-gutter:       40px;
$grid-baseline:             19px;

$grid-offsets:      false;

@import "core";
@import "layout";
@import "mock-block";

// @include GRID-GUIDES;

// Reference

.reference {
  position: absolute;
  left: 0;
  right: 0;
  opacity: .35;
  z-index: -1;

  img {
    margin: 0 auto;
    display: block;
  }
}

// Layout

#page {
  padding: 0;

  .masthead {
    @include block($height: 125px);
  }

  > nav {
    @include block(blue, $height: 30px);
  }

  > .content {
    padding: 0 19px;
    min-width: 0;
    width: auto;

    > .head {
      @include block($height: 58px);
      margin: 15px 0;
    }

    .sidebar {
      @include block(#baaf32, $height: 2418px);
      margin-bottom: 20px;
    }

    .l-container {
      @include grid-container(640px);
    }

    .p-article {
      @include block(#baaf32, $height: 1773px);
      margin-bottom: 10px
    }

    .sidebar {
      width: 300px;
    }

    .related {
      .l-col {
        padding: 0 10px;
        margin: 10px 0;
      }
      .item {
        @include block(purple, $height: 245px);
      }
      .l-col.p-title {
        margin: 57px 0 0;

        .item {
          min-height: 33px;
        }
      }
    }
  }

  .mastfoot {
    background: rgba(#222, .2);
    .l-col {
      @include block(#777, $height: 223px, $padding: 20px);
    }
  }
}
